import { useRoutes, useLocation, useNavigate, NavLink } from 'react-router-dom'
import { routes } from '../../router'
import { NavBar, Space, Toast } from 'antd-mobile'
import { SearchOutline, MoreOutline, CloseOutline } from 'antd-mobile-icons'
import { Badge, TabBar } from 'antd-mobile'

const Menu = () => {
    const location=useLocation()
    const navigate = useNavigate()
    const changeBar = (value: any) => {
        console.log(value, 'changeBar')
        navigate(value)
    }
    return (
        <div className='menu'>
            <TabBar onChange={changeBar} defaultActiveKey={location.pathname} >
                {routes.filter((item) => !item.isShow).map(item => (
                    <TabBar.Item
                        key={item.path}
                        icon={item.icon}
                        title={item.title}
                        style={{ margin: 30 }} />
                ))}
            </TabBar>
        </div>
    )
}
export default Menu